import { formatDate } from '@angular/common';
import { Component, ElementRef, NgZone, OnInit, Renderer2, ViewChild } from '@angular/core';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.scss']
})
  // tslint:disable
export class ChildComponent implements OnInit {
  
  

  private _title: string ;
  private _time:number; 
  @ViewChild('timeRef',{static:true}) timeRef: ElementRef | undefined; 

  constructor(private ngZooe: NgZone,private rd2: Renderer2) { 
    this._title = 'hi';
    this._time  = Date.now();
  }
  public get title(): string{

    console.log('脏值检测');
    return this._title;

  }
  
  public get time() : number {

    return this._time;

  }
  
  ngAfterViewChecked(): void {
    //Called after every check of the component's or directive's content.
    //Add 'implements AfterContentChecked' to the class.
    // this._title = 'hihi';
     this.ngZooe.runOutsideAngular(()=>{
        setInterval(() => {
          
          this._time  = Date.now();
          this._title = 'hic';
          if(this.timeRef !== undefined)
          //this.timeRef.nativeElement.innerHTML = Date.now()
          this.rd2.setProperty(this.timeRef.nativeElement,'innerText',formatDate(Date.now(), 'HH:mm:ss','en'))

        }, 1000);
    })
  }
  handleClick(ev: any){
    console.log(ev)
  }
  ngOnInit() {
  }

}
